<!DOCTYPE >
<html>
	<head>
		<meta charset="utf-8">
		<title>demo</title>
		<meta http-equiv="x-ua-compatible" content="IE=Edge, chrome=1" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=yes">
		<link rel="stylesheet" type="text/css" href="css/week.css" />
		<link rel="stylesheet" type="text/css" href="css/demo.css" />
	</head>
	<body>
		<div id="week" class="week"></div>
		<div class="panel">
			<h3>测试</h3>
			<label>更换日期</label>
			<select id="demoSelect">
				<option value="2018-01">2018-01</option>
				<option value="2018-02">2018-02</option>
				<option value="2018-03">2018-03</option>
				<option value="2018-04">2018-04</option>
				<option value="2018-05">2018-05</option>
				<option value="2018-06">2018-06</option>
			</select>
			<div id="demoText" style="margin-top:20px;"></div>
		</div>
		<div class="panel">
			<h3>使用方法</h3>
			<h4>调用</h4>
			<p>new Week(obj)</p>
			<h4>参数对象需添加属性</h4>
			<p>id："容器id"</p>
			<p>dateData："yyyy-mm"&nbsp;//&nbsp;默认今天日期</p>
			<p>callBack：fn;&nbsp;//&nbsp;返回选中的日期</p>
			<h4>重置年月方法</h4>
			<p>resetDate("yyyy-mm")</p>
		</div>
		<script src="js/week.js"></script>
		<script>
			window.onload = function(){
				/*初始化组件*/
				var weekModule = new Week({
						id:"week",			/*传入id*/
//						dateData:"2018-01",		/*传入日期*/
						callBack:function(data){/*自定义回调函数，返回点击位置的日期*/
							document.getElementById("demoText").innerText = data;							
						} 
					});
					
				
				/*用resetDate(date)方法可动态设置年月   参数格式为2018-06*/
				document.getElementById("demoSelect").addEventListener("input",function(){
					weekModule.resetDate(this.value);
				})
			}
		</script>
	</body>
</html>